<!-- 规则组件 -->
<template>
  <div>
    <div class="card-title card-title-background" >Point{{ point.index }}</div>
    <a-form
      layout='horizontal'
      ref='form'
      :model='point'
      :rules='points'
      :label-col='{ md: { span: 4 }, sm: { span: 24 } }'
      :wrapper-col='{ md: { span: 20 }, sm: { span: 24 } }'
    >
      <a-row :gutter='8'>
        <a-col :md='14' :sm='24' :xs='24'>
          <a-form-item label='百度纬度:' name='latitude'>
            <a-input-number
              :step="0.000001"
              string-mode
              :min="0" v-model:value='point.bd_latitude' style="width: 180px" allow-clear />
          </a-form-item>
        </a-col>
        <a-col :md='10' :sm='24' :xs='24'>
        </a-col>
      </a-row>

      <a-row :gutter='8'>
        <a-col :md='14' :sm='24' :xs='24'>
          <a-form-item label='百度经度:' name='longitude'>
            <a-input-number
              :step="0.000001"
              string-mode
              :min="0" v-model:value='point.bd_longitude' style="width: 180px" allow-clear />
          </a-form-item>
        </a-col>
        <a-col :md='10' :sm='24' :xs='24'>
        </a-col>
      </a-row>
    </a-form>
  </div>
</template>

<script>
export default {
  name: 'VehicleManagerGeofenceModeManagerFencelistSubpoint',
  emits: ['update:value'],
  props: {
    index : Number,
    point : Object
  },
  data() {
    return {
      points: [],
    };
  },
  methods: {

  }
};
</script>

<style lang="less" scoped>
.card-title {
  border-left: 5px solid;
  border-color: var(--primary-color);
  padding-left: 10px;
}

.card-title-background {
  background-color: #f5f5f5;
  height: 2em;
  line-height: 2em;
  margin-bottom: 2em;
}
</style>
